<template>
  <!-- :default-active="defaultActive.defaultActive" -->
  <MenuTree
    :menu="menuList"
    @clickItem="handleMenuClick"
    :update-click="handleMenuClick"
  />
</template>
  
 <script setup >
import { ref, reactive } from "vue";
import MenuTree from "@/components/Menu/MenuTree.vue";

import { useRouter, useRoute } from "vue-router";
// 自定义组件数据例子
import menuData from "@/components/Menu/MenuData.js";

// router是全局路由对象
let router = useRouter();
// 获取全部路由
console.log("router", router.options.routes[1].children);

// route是当前路由对象
let route = useRoute();
// quey传递过来的参数都是字符串类型
console.log(route, "route.params");

// const defaultActive = router.currentRoute.value.path; // "1-1-1-1" 默认选中的数据
const defaultActive = reactive({
  defaultActive: router.currentRoute.value.path,
});

// const menuList = ref(menuData);
const menuList = router.options.routes[1].children;

const handleMenuClick = (item) => {
  router.push(item.path);
  console.log("父组件", item.path);
};
</script>